<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>

    <div id="basedata-tb-mm" style="width:100px;">
        <div  onclick="addBasedata()" data-options="iconCls:'icon-folder-add'">添加数据组</div>
        <div  id="basedata-menu-add" data-options="iconCls:'icon-folder-brick',disabled:true">添加子数据</div>
    </div>
<div id="basedata-tb" style="padding:5px;">
	<a href="#"  class="easyui-menubutton" data-options="menu:'#basedata-tb-mm',iconCls:'icon-add'" >添加数据</a>
	<a href="#" class="easyui-linkbutton tngou-btn-basedata" data-options="iconCls:'icon-edit',plain:true,disabled:true" >编辑</a>
	<a href="#" class="easyui-linkbutton tngou-btn-basedata"  data-options="iconCls:'icon-cut',plain:true,disabled:true" >删除</a>				
	<span style="float:right;margin-right: 15px;"> 
		<input id="basedata-search" class="easyui-textbox">
	</span>

</div>

<!-- 右键菜单 -->
<div id="basedata-menu" class="easyui-menu" style="width:120px;">
	<div data-options="iconCls:'icon-folder-brick'">添加子数据</div>		
	<div data-options="iconCls:'icon-edit'">编辑数据</div>		
	<div data-options="iconCls:'icon-cut'">删除数据</div>	
</div>

	<section class="easyui-layout" style="width:100%;height:100%;">


			<table id="basedata-table" class="easyui-treegrid"
				style="width:100%;height:100%;"
				data-options="
				toolbar:'#basedata-tb',
            	url:'${Domain}api/basedata',
                rownumbers: true,               
                animate: true,
                collapsible: true,
                fitColumns: true,
                pagination:true,
                loadMsg:'数据加载中……',
                method: 'post',
                idField: 'id',
                treeField: 'text',
                onContextMenu:onRowContextMenu_basedata,
                onBeforeLoad: function(row,param){
                    if (!row) {    
                        param.id = 0;    
                    }
                }
            ">
				<thead>
					<tr>
						<th data-options="field:'',checkbox:true"></th>
						<th data-options="field:'id'">编号</th>
						<th data-options="field:'text',width:1">名称</th>
						<th data-options="field:'value'">值</th>
						<th data-options="field:'description',width:1">描述</th>
						<th data-options="field:'pinyin'">拼音</th>
						<th data-options="field:'seq'">排序</th>
						
					</tr>
				</thead>
		</table>
	

	</section>

<script type="text/javascript">
		

		//禁止按钮点击，选中数据后启用
		$('#basedata-table').treegrid({
						onLoadSuccess : function(row, data) {//加载
							$('.tngou-btn-basedata').linkbutton('disable');
							$("#basedata-tb-mm").menu('disableItem',$('#basedata-menu-add')[0]);				
						},
						onSelect : function(row) {//高亮选择
							$("#basedata-tb-mm").menu('enableItem', $('#basedata-menu-add')[0]);		
							$('.tngou-btn-basedata').linkbutton('enable');
									
						}
		});

		function onRowContextMenu_basedata(e, row) {
		    $(this).treegrid('select', row.id);
			e.preventDefault();
			$('#basedata-menu').menu('show', {
				left : e.pageX,
				top : e.pageY
			});
		

		}

	    //添加基础数据
		function addBasedata()
		{		
			$('#tngou-win').panel('resize',{width: 400,height: 340});
			$('#tngou-win').window('open');
			$('#tngou-win').window('setTitle','添加数据');
			$('#tngou-win').window('refresh', '${Domain}my/basedata/add');			
		}

			
</script>


</body>
</html>